@extends('admin.main')

@section('content')
<div class="wrapper wrapper-content">
    <div class="ibox">
        <div class="ibox-title">
            <h5>活动列表</h5>
        </div>
        <div class="ibox-content">

            <div class="tabs-container">
                <div class="tab-content">
                    <div id="tblDataList" class="tab-pane active">

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/html" id="tplDataBannerListTr">
     <div class="panel-body">
        <form role="form" class="form-inline">
            <div class="form-group">
                <input type="text" name="title" placeholder="标题" class="form-control">
            </div>
            <button class="btn btn-primary btn-sm" type="button" id="buttonData">搜索</button>
        </form>
        <div class="hr-line-dashed"></div>
        <table class="table table-striped table-bordered">
            <thead>
                <tr>
                    <th>id</th>
                    <th>banner</th>
                    <th>标题</th>
                    <th>开始时间</th>
                    <th>分类</th>
                    <!-- <th>操作</th> -->
                </tr>
            </thead>
            <tbody>
                @{{each rows.data as v i}}
                    <tr data-id="@{{v.id}}" data-status="@{{v.status}}">
                        <td>@{{v.id}}</td>
                        <td><img src="@{{v.pic}}" width="50px"></td>
                        <td>@{{v.title}}</td>
                        <td>@{{v.start_time}}</td>
                        <td>@{{v.class.name}}</td>
                    </tr>
                @{{/each}}
            </tbody>

        </table>
        <div class="text-center " id='pagination'></div>
    </div>
</script>

<script type="text/html" id="tplDataJoinListTr">
    <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button class="close" data-dismiss="modal" type="button">×</button>
                    <h4 class="modal-title">报名列表</h4>
                </div>
                <div class="modal-body">
                    <table class="table table-bordered">
                        <thead>
                            <tr>
                                <th>会员编码</th>
                                <th>报名时间</th>
                                <th>用户名</th>
                                <th>手机号</th>
                            </tr>
                        </thead>
                        <tbody>
                            @{{each data as row}}
                                <tr>
                                    <td>@{{row.user.number}}</td>
                                    <td>@{{row.created_at}}</td>
                                    <td>@{{row.user.nickname}}</td>
                                    <td>@{{row.user.mobile}}</td>
                                </tr>
                            @{{/each}}
                        </tbody>
                    </table>
                    <div class="row  pull-center  ">
                        <div class="col-md-12 text-right    pagination2">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                </div>
            </div>
        </div>
</script>

@endsection

@section('pageheader')
@endsection
@section('pagescript')

<script>
    $("#side-menu li[rel='activity']").addClass("active")
    .find("ul").addClass("in")
    .find("li[rel='2']").addClass("active");
    var filter = {page:1,status:0};
    $(function () {
        renderList();

        //修改状态
        $('#tblDataList').on('click','.btn-change',function(){
            var id=$(this).parents('tr').eq(0).attr('data-id');
            var status=$(this).parents('tr').eq(0).attr('data-status');
            var msg=$(this).attr('msg');
            layer.confirm('确定'+msg,{
                btn:['确定','取消']
            },function(){
                var url = '/admin/banner/change';
                $.post(url,{'id':id,'status':status},function(data){
                    layer.msg('操作成功');
                    renderList();
                }).fail(failure);
            },function(){
                layer.closeAll();
            })
        });

        $("#tblDataList").on('click','.btn-banner-del',function(){
            var id = $(this).parents('tr').eq(0).attr('data-id');
            layer.confirm('确定移除此banner吗？',{
                btn:['确定','取消']
            },function(){
                $.post('/admin/banner/del',{'id':id},function(data){
                    layer.msg('操作成功');
                    renderList();
                }).fail(failure);
            },function(){
                layer.closeAll();
            })
        })

        $('#tblDataList').on('click','#buttonData',function(){
            filter.title = $("input[name='title']").val();
            filter.page = 1;
            renderList();
        });

        $("#pagination").on("click", ".pagination a", function() {
            filter.page = $(this).attr("rel");
            renderList();
        });

    })

    var renderList = function(){
        $("#tblDataList").html('<div><p class="ibox-loading-31">&nbsp;</p></div>');
        var url = '/admin/banner/page-rows';
        $.get(url,filter,function(data){
            var pagination = data.rows;;
            $("#tblDataList").html(template("tplDataBannerListTr", data));
            $("#pagination").html(page(pagination.last_page, pagination.total, pagination.current_page));
        }).fail(failure);
    };

</script>
@endsection
